<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>
           <%= htmlWebpackPlugin.options.title %>
        </title>
        <!-- Open Graph data -->
        <!-- <meta property="og:title" content="Title Here" /> -->
        <!-- <meta property="og:url" content="http://www.example.com/" /> -->
        <!-- <meta property="og:image" content="http://example.com/image.jpg" /> -->
        <!-- <meta property="og:description" content="Description Here" /> -->
        <script>
            var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') || CSS.supports('top: constant(a)'))
            document.write('<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' + (coverSupport ? ', viewport-fit=cover' : '') + '" />')
        </script>

        <!-- <script type="text/javascript" src="//wap.cmread.com/rbc/t/content/repository/ues/js/s109/vconsole.js"></script>
        <script type="text/javascript">
            var vConsole = new VConsole();
        </script> -->

        <link rel="stylesheet" href="<%= BASE_URL %>static/index.<%= VUE_APP_INDEX_CSS_HASH %>.css" />
         <!--引入sdk -->
            <script src='https://wpk-gate.zjzwfw.gov.cn/static/wpk-jssdk.1.0.2/wpkReporter.js' crossorigin='true'></script>
            <script type="text/javascript" src="/static/js/zzdSDK.js"></script>
    </head>
    <body>
        <noscript>
            <strong>请启用JavaScript以继续</strong>
        </noscript>
        <div id="app">
            <div class="vertical-centered-box">
                <div class="content">
                    <div class="loader-circle"></div>
                    <div class="loader-line-mask one">
                        <div class="loader-line"></div>
                    </div>
                    <div class="loader-line-mask two">
                        <div class="loader-line"></div>
                    </div>
                    <div class="loader-line-mask three">
                        <div class="loader-line"></div>
                    </div>
                    <div class="loader-line-mask four">
                        <div class="loader-line"></div>
                    </div>
                </div>
            </div>
        </div>
        <style>
            .loader-line-mask {
            position: absolute;
            left: 50%;
            top: 30%;
            width: 60px;
            height: 120px;
            margin-left: -60px;
            margin-top: -60px;
            overflow: hidden;
            -webkit-transform-origin: 60px 60px;
            -moz-transform-origin: 60px 60px;
            -o-transform-origin: 60px 60px;
            -ms-transform-origin: 60px 60px;
            transform-origin: 60px 60px;
            -webkit-mask-image: -webkit-linear-gradient(top, #000000, rgba(0, 0, 0, 0));
            mix-blend-mode: hard-light;
            opacity: 0.8;
            }
            .loader-line-mask .loader-line {
            width: 120px;
            height: 120px;
            border-radius: 50%;
            }
            .loader-line-mask.one {
            -webkit-animation: rotate 2s infinite linear;
            -moz-animation: rotate 2s infinite linear;
            -o-animation: rotate 2s infinite linear;
            animation: rotate 2s infinite linear;
            }
            .loader-line-mask.one .loader-line {
            box-shadow: inset 0 0 0 8px #4076ED;
            }
            .loader-line-mask.two {
            -webkit-animation: rotate 1.8s 0.5s infinite linear;
            -moz-animation: rotate 1.8s 0.5s infinite linear;
            -o-animation: rotate 1.8s 0.5s infinite linear;
            animation: rotate 1.8s 0.5s infinite linear;
            }
            .loader-line-mask.two .loader-line {
            box-shadow: inset 0 0 0 8px #8794AA;
            }
            .loader-line-mask.three {
            -webkit-animation: rotate 2s 1s infinite linear;
            -moz-animation: rotate 2s 1s infinite linear;
            -o-animation: rotate 2s 1s infinite linear;
            animation: rotate 2s 1s infinite linear;
            }
            .loader-line-mask.three .loader-line {
            box-shadow: inset 0 0 0 8px #355DD4;
            }
            .loader-line-mask.four {
            -webkit-animation: rotate 1.8s 1.5s infinite linear;
            -moz-animation: rotate 1.8s 1.5s infinite linear;
            -o-animation: rotate 1.8s 1.5s infinite linear;
            animation: rotate 1.8s 1.5s infinite linear;
            }
            .loader-line-mask.four .loader-line {
            box-shadow: inset 0 0 0 8px #909399;
            }
            lesshat-selector {
            -lh-property: 0;
            }
            @-webkit-keyframes rotate {
            0% {
            -webkit-transform: rotate(0deg);
            }
            100% {
            -webkit-transform: rotate(360deg);
            }
            }
            @-moz-keyframes rotate {
            0% {
            -moz-transform: rotate(0deg);
            }
            100% {
            -moz-transform: rotate(360deg);
            }
            }
            @-o-keyframes rotate {
            0% {
            -o-transform: rotate(0deg);
            }
            100% {
            -o-transform: rotate(360deg);
            }
            }
            @keyframes rotate {
            0% {
            -webkit-transform: rotate(0deg);
            -moz-transform: rotate(0deg);
            -ms-transform: rotate(0deg);
            transform: rotate(0deg);
            }
            100% {
            -webkit-transform: rotate(360deg);
            -moz-transform: rotate(360deg);
            -ms-transform: rotate(360deg);
            transform: rotate(360deg);
            }
            ;
            }
            lesshat-selector {
            -lh-property: 0;
            }
            @-webkit-keyframes rotate {
            0% {
            -webkit-transform: rotate(0deg);
            }
            100% {
            -webkit-transform: rotate(360deg);
            }
            }
            @-moz-keyframes rotate {
            0% {
            -moz-transform: rotate(0deg);
            }
            100% {
            -moz-transform: rotate(360deg);
            }
            }
            @-o-keyframes rotate {
            0% {
            -o-transform: rotate(0deg);
            }
            100% {
            -o-transform: rotate(360deg);
            }
            }
            @keyframes rotate {
            0% {
            -webkit-transform: rotate(0deg);
            -moz-transform: rotate(0deg);
            -ms-transform: rotate(0deg);
            transform: rotate(0deg);
            }
            100% {
            -webkit-transform: rotate(360deg);
            -moz-transform: rotate(360deg);
            -ms-transform: rotate(360deg);
            transform: rotate(360deg);
            }
            ;
            }
            lesshat-selector {
            -lh-property: 0;
            }
            @-webkit-keyframes fade {
            0% {
            opacity: 1;
            }
            50% {
            opacity: 0.25;
            }
            }
            @-moz-keyframes fade {
            0% {
            opacity: 1;
            }
            50% {
            opacity: 0.25;
            }
            }
            @-o-keyframes fade {
            0% {
            opacity: 1;
            }
            50% {
            opacity: 0.25;
            }
            }
            @keyframes fade {
            0% {
            opacity: 1;
            }
            50% {
            opacity: 0.25;
            }
            ;
            }
            lesshat-selector {
            -lh-property: 0;
            }
            @-webkit-keyframes fade {
            0% {
            opacity: 1;
            }
            50% {
            opacity: 0.25;
            }
            }
            @-moz-keyframes fade {
            0% {
            opacity: 1;
            }
            50% {
            opacity: 0.25;
            }
            }
            @-o-keyframes fade {
            0% {
            opacity: 1;
            }
            50% {
            opacity: 0.25;
            }
            }
            @keyframes fade {
            0% {
            opacity: 1;
            }
            50% {
            opacity: 0.25;
            }
            ;
            }
            lesshat-selector {
            -lh-property: 0;
            }
            @-webkit-keyframes fade-in {
            0% {
            opacity: 0;
            }
            100% {
            opacity: 1;
            }
            }
            @-moz-keyframes fade-in {
            0% {
            opacity: 0;
            }
            100% {
            opacity: 1;
            }
            }
            @-o-keyframes fade-in {
            0% {
            opacity: 0;
            }
            100% {
            opacity: 1;
            }
            }
            @keyframes fade-in {
            0% {
            opacity: 0;
            }
            100% {
            opacity: 1;
            }
            ;
            }
            lesshat-selector {
            -lh-property: 0;
            }
            @-webkit-keyframes fade-in {
            0% {
            opacity: 0;
            }
            100% {
            opacity: 1;
            }
            }
            @-moz-keyframes fade-in {
            0% {
            opacity: 0;
            }
            100% {
            opacity: 1;
            }
            }
            @-o-keyframes fade-in {
            0% {
            opacity: 0;
            }
            100% {
            opacity: 1;
            }
            }
            @keyframes fade-in {
            0% {
            opacity: 0;
            }
            100% {
            opacity: 1;
            }
            ;
            }
        </style>
    </body>
</html>
